﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ProjectX._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Metro UI</title>
  
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.7.1.js'></script>
    <script src="Scripts/MetroJs.js" type="text/javascript"></script>
    <link href="css/MetroJs.css" rel="stylesheet" type="text/css" />
    <!--link type="text/css" href="css/jquery-ui-1.8.16.custom.css" rel="stylesheet" /-->	
    <link href="css/mycss.css" rel="stylesheet" type="text/css" />
<script type='text/javascript'>
    $(window).load(function () {
        $(".live-tile, .flip-list").not(".exclude").liveTile();
        $(".my-live-tile, .my-flip-list").not(".exclude").liveTile();
    });


</script>

</head>


<body bgcolor="black">
    <form id="form1" runat="server">
    <div ><br /><br />
    <br /><br /><br /><br /><br /><br /><br /><br /></div>
    <table bgcolor='black' border="0" width="400" cellpadding="0" cellspacing="0">
            <tr >
            <td align="center" colspan="1" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
                &nbsp;</td>
            <td valign="bottom" >
                <img src="images/menu.jpg" />
               <font face="Segoe UI" color="white" size=20>Menu</font> </td>
            <td>
                &nbsp;</td>
                <td>
                    &nbsp;</td>
        </tr>
        <tr>
        <td >
                &nbsp;</td>
            <td>
                <a href="#">
                <div class="live-tile" data-stops="100%" data-speed="750" data-delay="3000">
                <div><img src="images/hocsinh_ic.jpg" /></div>
                <div><img src="images/hocsinh.jpg"  /></div>           
                </div></a>
            </td>
            <td >
                <a href="#">
                <div class="red live-tile" data-mode="flip" data-delay="4000">
                <div>
                    <img src="images/giaovien_ic.jpg" />
                </div>
                <div>
                    <img src="images/giaovien.jpg" />
                </div>
               
                </div>
             </a>
             </td>
            <td>
            <a href="#" ">
                <div class="list-tile">
                    <ul id="flip1" class="flip-list fourTiles" data-initdelay="500" data-mode="flip-list" data-delay="3000">
                        <li>
                            <div>
                                <img src="images/phuhuynh1.jpg" /></div>
				            <div>
                                <img src="images/phuhuynh1_ic.jpg" /></div>
                        </li>
                        <li>
                            <div>
                                <img src="images/phuhuynh3.jpg" /></div>
				            <div>
                                <img src="images/phuhuynh3_ic.jpg" /></div>
                        </li>
                        <li>
                            <div>
                                <img src="images/phuhuynh2.jpg" /></div>
				            <div>
                                <img src="images/phuhuynh2_ic.jpg" /></div>
                        </li>
                        <li >
                            <div>
                                <img src="images/phuhuynh4.jpg" /></div>
				            <div>
                                <img src="images/phuhuynh4_ic.jpg" /></div>
                        </li>
                    </ul>
    </div></a>
            </td>
        </tr>
        <tr>
        <td >
                &nbsp;</td>
            <td>
                &nbsp;</td>
            <td >
                &nbsp;</td>
            <td align="">
            <div  class="my-live-tile" data-direction="horizontal" data-delay="4200" >
                <div><img src="images/trogiup.jpg" /></div>
                <div><img src="images/thongtin.jpg" /></div>
             </div>
             <div class="my-live-tile" data-mode="flip" data-delay="3000">
                <div><img src="images/thongtin.jpg" /></div>
                <div><img src="images/trogiup.jpg" /> </div>
             </div>
            </td>
        </tr>
        <tr>
        <td>
                &nbsp;</td>
            <td>
                &nbsp;</td>
            <td>
                &nbsp;</td>
            <td>
                &nbsp;</td>
        </tr>
    </table>

    </form>
</body>


<footer class="appbar">
       <font face="Segoe UI" color="white" size=7>Copyright 2012 <br /><font face="Segoe UI" color="white" size=5>by Ngoanrazor</font></font> </td>
      <a class="etc">&bull;&bull;&bull;</a>
      <br /><br /><br /><br /><br /><br />
      <font face="Segoe UI" color="white" size=5>Quản lý trường tiểu học</font>
  </footer>
  <script type="text/javascript">
      $(document).ready(function () {
          $(".appbar").applicationBar({
              preloadAltBaseTheme: true,
              bindKeyboard: true,
          });
      });
  </script>

</html>
